/**
 * 1输入框绑定 值改变事件 input事件
 *    1获取到输入框的值
 *    2合法性判断
 *    3检验通过 把输入框的值发送到后台
 *    4返回的数据渲染到页面
 * 2防抖(防止抖动) 定时器
 *    1防抖 一般用在输入框中 防止重复输入重复发送请求
 *    2节流 一般使用在页面上拉和下拉
 *    3定义一个全局的定时器
 */
import {request} from "../../request/index"

Page({

  /**
   * 页面的初始数据
   */
  data: {
    goods:[],
    //"取消按钮 是否显示"
    isFocus:false,
    //输入框的值
    inpValue:""
  },
  TimeId:-1,
  //处理搜索框
  handleInput(e){
    //1获取输入框的值
    const {value} = e.detail
    //2检验合法性
    if(!value.trim || value==""){
      //不合法
      clearTimeout(this.TimeId)
      this.setData({
        goods:[],
        isFocus:false
      })
      return;
    }
    //3准备发送请求获取数据
    this.setData({
      isFocus:true
    })
    clearTimeout(this.TimeId)
    this.TimeId = setTimeout(()=>{
      this.qsearch(value)
    },1000)
  },
  //发送请求获取搜索建议 数据
  async qsearch(query){
      const res = await request({url:"/goods/search",data:{query}})
      this.setData({
        goods:res.goods
      })
      
  },
  //点击 取消按钮
  handleCancle(){
    this.setData({
      inpValue:"",
      isFocus:false,
      goods:[]
    })
  },
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {

  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {

  }
})